<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@include file="../activiti/head.jsp"%>
     <!--Start Breadcrumb-->
<div class="row">
	<div id="breadcrumb" class="col-xs-12">
	<a href="#" class="show-sidebar">
						  <i class="fa fa-bars"></i>
						</a>
		<ol class="breadcrumb pull-left">
			<li><a href="index">首页</a></li>
			<li><a href="#">系统管理</a></li>
			<li><a href="#">角色管理</a></li>
		</ol>
	</div>
</div>       
            <div class="container-fluid">
                       <div class="row">
                    <div class="col-lg-12">
                    <div class="box ui-draggable ui-droppable">
				<div class="box-header">
					<div class="box-name">
						<i class="fa fa-coffee"></i> <span>角色管理</span>
					</div>
					<div class="box-icons">
						<a class="collapse-link"> <i class="fa fa-chevron-up"></i>
						</a> <a class="expand-link"> <i class="fa fa-expand"></i>
						</a> <a class="close-link"> <i class="fa fa-times"></i>
						</a>
					</div>
					<div class="no-move"></div>
				</div>
				<div class="box-content">
				<%--<button id="addrole" type="button" class="btn btn-primary">添加新角色</button>--%>
					 <table id="grid-data" class="table table-condensed table-hover table-striped">
							        <thead>
							            <tr>
							                <th data-column-id="pkRoleId" data-identifier="true" data-type="numeric">角色id</th>
							                <th data-column-id="roleName">角色名</th>
							                <th data-formatter="rights" data-column-id="rolelist">拥有权限</th>
							                <th data-formatter="commands">操作</th>
							            </tr>
							        </thead>
							    </table>
				
				
                </div>
                            </div>
                        </div>
                    </div>
</div>
<%--<%@include file="../activiti/foot.jsp"%>--%>
<script src="/plugins/jquery/jquery.min.js"></script>
<script src="/plugins/jquery-ui/jquery-ui.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="/plugins/bootstrap/bootstrap.min.js"></script>
<script src="/plugins/justified-gallery/jquery.justifiedGallery.min.js"></script>
<script src="/plugins/tinymce/tinymce.min.js"></script>
<script src="/plugins/tinymce/jquery.tinymce.min.js"></script>
<script src="/js/jquery.bootgrid.min.js"></script>
 <script type="text/javascript">
    $(document).ready(function(){
	    var grid=$("#grid-data").bootgrid({
	        ajaxSettings: {
		        method: "POST"
    		},
	    	navigation:2,
  			columnSelection:false,
		    ajax:true,
		    url:"../../system/roles.do",
		    formatters: {
		    "rights":function(column,row){
//				console.log(row);
				var len=row.role_permissions.length;
		    	var str="";
		    	for(var t=0;t<len;t++)
		    		str+=row.role_permissions[t].permission.permissionname+',';
		    	str=str.substring(0,str.length-1);
				return str;
		    },
		    "commands": function(column, row)
		    {
					return "<button class=\"btn btn-xs btn-default ajax-link command-run1\" data-row-id=\"" + row.pkRoleId + "\">修改</button>";
		    }
	    	}
	    
	    }).on("loaded.rs.jquery.bootgrid", function()
	    		{
	    	    grid.find(".command-run1").on("click", function(e)
	    	    {
	    	    	$("#roleinfo").modal();
	    	    	var rid=$(this).data("row-id");
					$.ajax({
						url:"../../system/roleinfo.do",
						dataType:"json",
						type:"POST",
						data:{"rid":rid},
						async:false,
						success:function (data) {
							console.log("data="+data);
							$("#roleName").val(data.roleName);
							var role_permission=data.role_permissions;
							var roles=[];
							for(var a=0;a<role_permission.length;a++){
								var name=role_permission[a].permission.permissionname;
								roles.push(name);
							}
							$.ajax({
								url:"../../system/permissionlist.do",
								dataType:"json",
								type:"POST",
								async:false,
								success:function (a) {
									$("#roles").html("");
									for(var m=0;m<a.length;m++){
										if(roles.indexOf(a[m].permissionname)<0)
											$("#roles").append("<div class=\"checkbox-inline\"><label><input name='permissionname[]' value="+a[m].permissionname+" type=\"checkbox\">"+a[m].permissionname+"<i class=\"fa fa-square-o\"></i></label></div>");
										else
											$("#roles").append("<div class=\"checkbox-inline\"><label><input name='permissionname[]' value="+a[m].permissionname+" type=\"checkbox\" checked=\"checked\">"+a[m].permissionname+"<i class=\"fa fa-square-o\"></i></label></div>");
									}
									roles=[];
								}
							});
							$("#btn").click(function(){
								var a=$("input[type='checkbox']").size();
								var flag=false;
								for(var m=0;m<a;m++){
									if($("input[type='checkbox']").eq(m).is(':checked'))
										flag=true;
								}
								if(!flag){
									alert("必须选择至少选择一个权限");
									return false;
								}
								$.ajax({
									url:"../../system/updaterole.do?rid="+rid,
									dataType:"json",
									type:"POST",
									data:$("form").serialize(),
									async:false,
									success:function (a) {
										$("#roleinfo").modal('hide');
										alert("修改成功");
										LoadAjaxContent("../../system/roleadmin.do");
										history.go(0);
									}
								});
							});
						}
					});
	    	    });
	    
	    
	    });
	  });
	 
    </script>
    <div id="roleinfo" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">编辑角色信息</h4>
      </div>
      <form class="form-horizontal" method="post">
      <div class="modal-body">
        	<div class="row form-group">
			    <label for="roleName" class="col-sm-1 control-label">角色名</label>
			    <div class="col-sm-11">
			      <input type="text" name="roleName" class="form-control" id="roleName" readonly="readonly">
			    </div>
        	</div>
        	<h4 class="page-header">拥有权限</h4>
        	<div class="row form-group">
					<div class="col-sm-12" id="roles">
					</div>
			</div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" id="btn" class="btn btn-primary">保存</button>
      </div>
      </form>
    </div>
  </div>
</div>
